{% extends 'crm/sub_page/base.html' %}
{% load staticfiles %}
{% block content %}
<h1>就业信息详情</h1>
    <div>薪水：
        <input name="username">
    </div>
    <table id="table"
               data-toggle="table"
               data-toolbar="#toolbar_jobinfo"
               data-height="460"
               data-query-params="queryParams"
               data-pagination="true"
               data-side-pagination="server"
               data-search="true"
               data-url="{% url 'count:job_info' %}"
               data-page-list="[10, 25, ALL]"
               data-page-size="5"
               data-show-refresh="true"
               data-show-toggle="true"
               data-show-export="true"
               data-export-types="['excel']"
               data-export-options='{
                 "fileName": "备件操作日志",
                 "worksheetName": "备件操作日志",
                 }'>
            <thead>
            <tr>
{#                <th data-field="id">ID</th>#}
                <th data-field="student__detail__real_name">姓名</th>
                <th data-field="company">公司</th>
                <th data-field="salary">薪水</th>
                <th data-field="position">岗位</th>
                <th data-field="job_photo">照片</th>
                <th data-field="oper"
                    data-formatter="operateFormatter"
                    data-events="operateEvents">操作</th>
            </tr>
            </thead>
        </table>


{% endblock %}
{% block loadjs %}
<script src="{% static 'bootstrap-table/bootstrap-table.min.js' %}" type="text/javascript"></script>
<script src="{% static 'bootstrap-table/tableExport.js' %}" type="text/javascript"></script>
<script src="{% static 'bootstrap-table/bootstrap-table-export.js' %}" type="text/javascript"></script>
<script>
    $(function(){
        $('.fixed-table-toolbar .search').removeClass('search').addClass('search2')
    })
    $table = $('#table');
    function  queryParams(tableParams) {
        var params = {};
        params['pagesize'] = tableParams.limit;
        params['offset'] = tableParams.offset;
        params['page'] = $table.bootstrapTable('getOptions').pageNumber;
        $('#toolbar_jobinfo').find('input[name]').each(
            function () {
                params[$(this).attr('name')] = $(this).val()
            }
        );
        return params
    }

    window.operateEvents = {
        'click .like': function (e, value, row) {
            alert('Like:'+JSON.stringify(row));
        },
        'click .remove': function (e, value, row) {
            names = [row['student__detail__real_name'],];
            alert(names)
            $table.bootstrapTable('remove', {field: 'student__detail__real_name', values: names})
        },
    };

    function operateFormatter(value, row, index) {
        return [
            '<a class="like" href="javascript:void(0)" title="Like">',
            '<i class="glyphicon glyphicon-heart"></i>',
            '</a>  ',
            '<a class="remove" href="javascript:void(0)" title="Remove">',
            '<i class="glyphicon glyphicon-remove"></i>',
            '</a>'
        ].join('');
    }


</script>
{% endblock %}

{% block loadcss %}
<link href="{% static 'bootstrap-table/bootstrap-table.min.css' %}" rel="stylesheet">
<style>
        .fixed-table-toolbar .search2 {
            position: relative;
            margin-top: 10px;
            margin-bottom: 10px;
            line-height: 34px;
        }
</style>
{% endblock %}
